<template lang="pug">
.form-group(:class="{ 'label-floating' : labelFloating }")
  label.control-label(v-if='label')
    | {{label}}
  textarea.form-control(v-bind='$props', @input="$emit('input',$event.target.value)" , v-if="type === 'textarea'")
  input.form-control(v-bind='$props', v-bind:value='domValue', @input="$emit('input',$event.target.value)", v-else)
</template>
<script>
export default {
  name: 'md-fg-input',
  computed: {
    domValue () {
      if (this.type === 'date' && this.value instanceof Date) {
        var minutesOffset = this.value.getTimezoneOffset()
        var millisecondsOffset = minutesOffset * 60 * 1000
        var local = new Date(this.value - millisecondsOffset)
        return local.toISOString().substr(0, 10)
      }
      return this.value
    }
  },
  props: {
    type: {
      type: String,
      default: 'text'
    },
    label: String,
    name: String,
    disabled: Boolean,
    placeholder: String,
    value: [String, Number, Date],
    labelFloating: Boolean,
    rows: Number,
    cols: Number
  }
}

</script>
<style lang="scss"></style>
